<template>
    <el-row>
        <el-col :span="23"></el-col>
        <el-col :span="1"><div class="grid-content ep-bg-purple-dark">{{ state.nickname }}</div></el-col>
    </el-row>
</template>

<script setup>
import { reactive } from 'vue'
import { getUserInfo } from '../service/user'

const state = reactive({
  nickname: '未登录',
})

getUserInfo().then(res => {
  state.nickname = res.data.nickName
})
</script>

<style scoped>
.el-row {
  background-color: #B3C0D1;
  color: #333;
  height: 40px;
  line-height: 40px;
}
</style>